import 'package:flutter/material.dart';
import "type.dart";

// 最常访问滚动列表
class DynamicVisitScrollListWidget extends StatelessWidget {
  final List<DynamicVisitItem> dynamicVisitItemList; //最常访问数组
  final List<DynamicLivingItem> dynamicLivingItemList; //当前直播数组
  const DynamicVisitScrollListWidget({
    super.key,
    required this.dynamicLivingItemList,
    required this.dynamicVisitItemList,
  });
  @override
  Widget build(BuildContext context) {
    SliverList visitSliverList = SliverList.builder(
        itemCount: dynamicVisitItemList.length,
        itemBuilder: (BuildContext context, int index) {
          DynamicVisitItem visitItem = dynamicVisitItemList[index];
          return Container(
            padding: EdgeInsets.only(
              left: 10,
              right: index == dynamicVisitItemList.length - 1 ? 10 : 0,
            ),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Padding(
                  padding: const EdgeInsets.only(bottom: 8),
                  child: Stack(
                    children: [
                      CircleAvatar(
                        radius: 25,
                        backgroundImage: AssetImage(visitItem.avatar),
                        backgroundColor: const Color(0xfff4f5fa),
                      ),
                      visitItem.checked
                          ? const SizedBox()
                          : Positioned(
                              bottom: 0,
                              right: 0,
                              child: Container(
                                width: 11,
                                height: 11,
                                decoration: BoxDecoration(
                                  color:
                                      const Color.fromARGB(255, 249, 150, 211),
                                  borderRadius: BorderRadius.circular(6),
                                  border: Border.all(
                                    color: Colors.white,
                                    width: 2,
                                  ),
                                ),
                              ),
                            )
                    ],
                  ),
                ),
                Expanded(
                  flex: 1,
                  child: SizedBox(
                    width: 64,
                    child: Text(
                      visitItem.upName,
                      textAlign: TextAlign.center,
                      overflow: TextOverflow.ellipsis,
                      maxLines: 2,
                      style: const TextStyle(
                        height: 1.1,
                        fontSize: 11,
                        color: Color.fromARGB(255, 87, 87, 89),
                      ),
                    ),
                  ),
                )
              ],
            ),
          );
        });

    SliverList livingSliverList = SliverList.builder(
      itemCount: dynamicLivingItemList.length,
      itemBuilder: (BuildContext context, int index) {
        DynamicLivingItem item = dynamicLivingItemList[index];
        return Container(
          padding: EdgeInsets.only(
            left: 10,
            right: index == dynamicLivingItemList.length - 1 ? 10 : 0,
          ),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Padding(
                padding: const EdgeInsets.only(bottom: 4),
                child: Stack(
                  alignment: Alignment.bottomCenter,
                  children: [
                    Container(
                      padding: const EdgeInsets.all(1),
                      margin: const EdgeInsets.only(bottom: 4),
                      decoration: BoxDecoration(
                          border: Border.all(
                            color: const Color.fromARGB(255, 249, 150, 211),
                            width: 1,
                          ),
                          borderRadius: BorderRadius.circular(26)),
                      child: CircleAvatar(
                        radius: 25,
                        backgroundImage: AssetImage(item.avatar),
                        backgroundColor: const Color(0xfff4f5fa),
                      ),
                    ),
                    Container(
                      width: 60,
                      height: 20,
                      decoration: BoxDecoration(
                        color: const Color.fromARGB(255, 249, 150, 211),
                        borderRadius: BorderRadius.circular(12),
                        border: Border.all(color: Colors.white, width: 1),
                      ),
                      child: const Row(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.center,
                        children: [
                          Icon(
                            Icons.bar_chart,
                            size: 14,
                            color: Colors.white,
                          ),
                          Text(
                            '直播中',
                            style: TextStyle(
                              color: Colors.white,
                              fontSize: 10,
                            ),
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
              Expanded(
                flex: 1,
                child: SizedBox(
                  width: 64,
                  child: Text(
                    item.upName,
                    textAlign: TextAlign.center,
                    overflow: TextOverflow.ellipsis,
                    maxLines: 2,
                    style: const TextStyle(
                      height: 1.1,
                      fontSize: 11,
                      color: Color.fromARGB(255, 87, 87, 89),
                    ),
                  ),
                ),
              )
            ],
          ),
        );
      },
    );
    bool isInline =
        dynamicLivingItemList.isNotEmpty && dynamicLivingItemList.length <3;
    return Column(
      children: [
        SizedBox(
          height: 90,
          width: double.infinity,
          child: CustomScrollView(
            scrollDirection: Axis.horizontal,
            slivers: [
              isInline
                  ? livingSliverList
                  : const SliverToBoxAdapter(child: SizedBox.shrink()),
              isInline
                  ? SliverToBoxAdapter(
                      child: Container(
                      width: 1,
                      margin: const EdgeInsets.only(
                          left: 10, right: 10, bottom: 20),
                      decoration: const BoxDecoration(color: Colors.black12),
                    ))
                  : const SliverToBoxAdapter(child: SizedBox.shrink()),
              visitSliverList,
            ],
          ),
        ),
        !isInline
            ? Container(
              padding:const EdgeInsets.only(top: 4),
                height: 90,
                width: double.infinity,
                child: CustomScrollView(
                  scrollDirection: Axis.horizontal,
                  slivers: [livingSliverList],
                ),
              )
            : const SizedBox.shrink(),
      ],
    );
  }
}
